@charset "utf-8";
.hangneikuai{
    display: inline-block;
}
.fll{
    float: left;
}
.flr{
    float: right;
}
.ac{
    color: #122d6c;
    border-bottom: 1px solid #122d6c;
}
.auto{
    padding-top: 0;
}
.swiper-slide{
    p{
        width: 80%;
        margin: 0 auto;
        background: #f3f5f7;
        text-align: center;
        padding-top: 35px;
        padding-bottom: 35px;
    }
}
.web{
    width: 100%;
    height: 100%;
    .top{
        width: 100%;
        background: #122d6c;
        .shangbox{
            height: 40px;
            width: 80%;
            height: 100%;
            margin: 0 auto;
            line-height: 40px;
            font-size: 14px;
            color: white;
            span{
                margin-left: 20px;
            }
        }
    }
        .header{
            width: 80%;
            margin: 0 auto;
            padding-top: 30px;
            .logo{
                img{
                    vertical-align: middle;
                }
            }
            .company{
                vertical-align: middle;
                margin-left: 22px;
                p:nth-child(1){
                    font-weight: bold;
                    font-size: 29px;
                    color: #0a2970;
                }
                p:nth-child(2){
                    font-size: 8px;
                    color: #9198b0;
                    letter-spacing:2px;
                }
            }
            .details{
                padding-top: 22px;
                color: #666666;
                height: 80px;
                span{
                    margin-left: 30px;
                    cursor: pointer;
                    height: 35px;
                    display: inline-block;
                }
                span:nth-child(1){
                    margin-left: 0;
                }
                :hover{
                    color: #122d6c;
                    border-bottom: 1px solid #122d6c;
                }
            }
        }
    .bigpic{
        margin: 0 auto;
        img{
            width: 100%;
//          height: 504px;
        }
    }
    .Mission{
        width: 80%;
        margin: 0 auto;
        font-size: 0;
        padding-top: 50px;
        padding-bottom: 18px;
        border-bottom: 1px solid #d3d3d3;
        span:nth-child(1){
            font-weight: bold;
            font-size: 24px;
            margin-right: 16px;
        }
        span:nth-child(2){
            font-size: 13px;
            color: #838385;
        }
    }
    .content{
        width: 80%;
        margin: 0 auto;
        .title{
            padding-top: 50px;
            padding-bottom: 31px;
            font-weight: bold;
            font-size: 27px;
            color: #122d6c;
            text-align: center;
        }
        .contentbox{
            font-size: 19px;
            color: #666666;
            text-indent: 40px;
            span{
                color: black;
                font-weight: bold;
            }
            
        }
    }
    .Missionbox{
        width: 80%;
        margin: 0 auto;
        .left{
            width: 60%;
            font-size: 17px;
            padding-top: 70px;
            ul{
                li{
                    font-size: 17px;
                    margin-left: 21px;
                    span{
                        margin-right: 19px;
                        img{
                            width: 8px;
                            vertical-align: middle;
                        }
                    }
                }
                li:nth-child(1){
                    list-style:none;
                    padding-top: 8px;
                    text-indent: 35px;
                    color: #122d6c;
                    padding-bottom: 50px;
                }
                li:nth-child(2){
                    padding-bottom: 22px;
                    border-bottom: 1px dashed #d3d3d3;
                }
                li:nth-child(3){
                    padding-top: 25px;
                    padding-bottom: 22px;
                    border-bottom: 1px dashed #d3d3d3;
                }
                li:nth-child(4){
                    padding-top: 25px;
                    padding-bottom: 107px;
                }
            }
        }
        .right{
            width: 38%;
            height: 375px;
            margin-left: 13px; 
            img{
                height: 100%;
                width: 100%;
            }
        }
    }
    .auto{
        padding-top: 0;
    }
    .understand{
        width:80%;
        margin: 0 auto;
        font-size: 0;
        .udd{
            height: 227px;
        }
        .ud{
            padding-top: 85px;
            width: 25%;
            display: inline-block;
            vertical-align: middle;
                div{
                    width: 95%;
                    margin: 0 auto;
                    height: 100%;
                    img{
                    width: 100%;
                    height: 100%;
                }
                p{
                    width: 90%;
                    margin: 0 auto;
                }
                p:nth-child(1){
                    padding-top: 57px;
                    text-align: center;
                    font-size: 22px;
                    color: #122d6c;
                }
                p:nth-child(2){
                    margin: 0 auto;
                    width: 88px;
                    height: 1px;
                    background: black;
                    margin-top: 15px;
                    margin-bottom: 27px;
                }
                p:nth-child(3){
                    font-size: 13px;
                }
            }
        }
        .understandbox{
            background: #f3f5f7;
            div{
                width: 90%;
                margin: 0 auto;
            }
        }
        .ud:nth-child(5){
            padding-top: 20px;
        }
        .ud:nth-child(6){
            padding-top: 20px;
        }
        .ud:nth-child(7){
            padding-top: 20px;
        }
        .ud:nth-child(8){
            padding-top: 20px;
        }
    }
    .buttom{
        height: 4px;
        background: #122d6c;
        margin-top: 100px;
    }
    .call{
        width: 80%;
        margin: 0 auto;
        .callbox{
            width: 90%;
            margin: 0 auto;
            div{
                width: 32%;
                margin: 0 auto;
                text-align: center;
                padding-top: 53px;
                padding-bottom: 35px;
                p:nth-child(1){
                    padding-bottom: 17px;
                    font-size: 19px;
                }
                p:nth-child(2){
                    font-size: 14px;
                    color: #555555;
                }
            }
        }
        .gongsi{
            text-align: center;
            font-size: 13px;
            padding-bottom: 20px;
        }
    }
}

@media (max-width:1000px){
    .web .top .shangbox{
        text-align: center;
    }
    .web .understand .ud{
        width: 100%;
        padding-top: 20px;
        height: auto;
        padding-bottom: 20px;
    }
    .web .understand .ud div p:nth-child(3){
        padding-bottom: 20px;
        text-align: center;
    }
    .web .Mission span:nth-child(1){
        display: inline-block;
        width: 100%;
    }
    .web .content .contentbox{
        padding-bottom: 0;
    }
    .web .Missionbox .right{
        width: 100%;
    }
    .web .top .header .details{
        width: 100%;
    }
    .web .Missionbox .left{
        width: 100%;
    }
    .web .Mission{
        text-align: center;
    }
    .web .call .callbox div{
        width: 100%;
    }
    .web .top .header{
        text-align: center;
    }
    .right{
        img{
            width: 100%;
        }
    }
    .xiagu{
        width: 100%;
        #tupian p{
            text-align: left;
            width: 22%;
        }
    }
    .web .auto{
        padding-top: 50px;
    }
    .web .understand .ud div p:nth-child(1){
        padding-top: 20px;
    }
    .bigpic{
        img{
            width: 100%;
        }
    }
}
@media (min-width:1400px){
    .bigpic{
        width: 80%;
        margin: 0 auto;
        img{
            width: 100%;
        }
    }
}
@media (max-width:1000px){
    .bigpic{
        width: 80%;
        margin: 0 auto;
        img{
            width: 100%;
        }
    }
}
//@media (min-width:1349px){
//  .ud{
//      height: 227px;
//  }
//}
//@media (max-width:480px){
//  .web .top .header .details span{
//      width: 100%;
//      display: inline-block;
//  }
//}
@media(max-width:1000px){
    .web .header .details{
        width: 100%;
        text-align: center;
        span{
            width: 15%;
        }
    }
    .logo{
        width: 100%;
        text-align: center;
    }
}
